h3.mb-3 Shell

.form-line
    .header
        .title Profile
        .description Default profile for new tabs

    select.form-control(
        [(ngModel)]='config.store.terminal.profile',
        (ngModelChange)='config.save()',
    )
        option(
            *ngFor='let profile of profiles',
            [ngValue]='terminal.getProfileID(profile)'
        ) {{profile.name}}


.form-line(*ngIf='isConPTYAvailable')
    .header
        .title Use ConPTY
        .description Enables the experimental Windows ConPTY API

    toggle(
        [(ngModel)]='config.store.terminal.useConPTY',
        (ngModelChange)='config.save()'
    )

.alert.alert-info.d-flex.align-items-center(*ngIf='config.store.terminal.useConPTY && isConPTYAvailable && !isConPTYStable')
    .mr-auto Windows 10 build 18309 or above is recommended for ConPTY

.alert.alert-info.d-flex.align-items-center(*ngIf='config.store.terminal.profile.startsWith("WSL") && (!config.store.terminal.useConPTY)')
    .mr-auto WSL terminal only supports TrueColor with ConPTY

.form-line(*ngIf='config.store.terminal.profile == "custom-shell"')
    .header
        .title Custom shell

    input.form-control(
        type='text',
        [(ngModel)]='config.store.terminal.customShell',
        (ngModelChange)='config.save()',
    )

.form-line
    .header
        .title Working directory
    .input-group
        input.form-control(
            type='text',
            placeholder='Home directory',
            [(ngModel)]='config.store.terminal.workingDirectory',
            (ngModelChange)='config.save()',
        )
        .input-group-append
            button.btn.btn-secondary((click)='pickWorkingDirectory()')
                i.fas.fa-folder-open

.form-line
    .header
        .title Directory for new tabs

    select.form-control(
        [(ngModel)]='config.store.terminal.alwaysUseWorkingDirectory',
        (ngModelChange)='config.save()',
    )
        option([ngValue]='false') Same as active tab's directory
        option([ngValue]='true') The working directory from above

.form-line.align-items-start
    .header
        .title Environment
        .description Inject additional environment variables

    environment-editor([(model)]='this.config.store.terminal.environment')

.form-line(*ngIf='config.store.terminal.profiles.length > 0')
    .header
        .title Show default profiles in the selector
        .description If disabled, only custom profiles will show up in the profile selector

    toggle(
        [(ngModel)]='config.store.terminal.showDefaultProfiles',
        (ngModelChange)='config.save()'
    )

h3.mt-3 Saved Profiles

.list-group.list-group-flush.mt-3.mb-3
    .list-group-item.list-group-item-action.d-flex.align-items-center(
        *ngFor='let profile of config.store.terminal.profiles',
        (click)='editProfile(profile)',
    )
        .mr-auto
            div {{profile.name}}
            .text-muted {{profile.sessionOptions.command}}
        button.btn.btn-outline-danger.ml-1((click)='$event.stopPropagation(); deleteProfile(profile)')
            i.fas.fa-trash

.pb-4(ngbDropdown, placement='top-left')
    button.btn.btn-primary(ngbDropdownToggle)
        i.fas.fa-fw.fa-plus
        | New profile
    div(ngbDropdownMenu)
        button.dropdown-item(*ngFor='let shell of shells', (click)='newProfile(shell)') {{shell.name}}
